﻿/// <reference path="jquery-1.11.3.min.js" />

$(function () {
    var index = 0; //代表图片下标和导航数字的下标
    var speed = 1000;
    $("#imgbox #num li:eq(0)").addClass("red")
    function moveTop() {
        $("#imgbox #num li:eq(" + index + ")").addClass("red").siblings().removeClass("red");
        $("#imgbox #img").css("bottom", index * $("#imgbox").height() + "px");
        if (index < $("#imgbox #img li").length - 1) {
            index++;
        } else {
            index = 0;
        }

    }

    var interval = setInterval(moveTop, speed);
    $("#imgbox #num li").mouseover(function () {
        clearInterval(interval);
        index = $(this).index();
        $("#imgbox #num li:eq(" + index + ")").addClass("red").siblings().removeClass("red");
        $("#imgbox #img").css("bottom", index * $("#imgbox").height() + "px");
    })
    $("#imgbox").hover(function () {
        clearInterval(interval);
    }, function () {
        interval = setInterval(moveTop, speed);
    })
})